	{% extends "base.html" %}
	{% block title %} Welcome to Text Minging Demo Site {% endblock %}
	{% block js%}
	<script type="text/javascript">
      function init(tag){
    	  $('#myModalLabel').html(tag.text);
    	  $('#newscontent').html(tag.title);
    	  $('#myModal').modal('show');
      }
    </script>
    <style>
    .trend{
	    padding: 1px 9px 2px;
		-webkit-border-radius: 9px;
		-moz-border-radius: 9px;
		border-radius: 9px;
		font-size: 16px;
		font-weight: bold;
		line-height: 14px;
		color: white;
		text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
		white-space: nowrap;
		vertical-align: baseline;
    }
    .trend0{
    	background-color: #B94A48;
    }
    .trend1{
    	background-color: #FF8F00;
    }
    .trend2{
    	background-color:  #FFEB00;;
    }
    .trend3{
    	background-color:  #3F0;
    }
    .trend4{
    	background-color:  #0052FF;
    }
    .trend5{
    	background-color:  #5C00FF;
    }
    .trend6{
    	background-color:  #E000FF;
    }
    .trend7{
    	background-color:   #00EBFF;
    }
    .trend8{
    	background-color:  #00FFE0;
    }
    </style>
	{%endblock%}
	
	{% block head %} Text Mining Search {% endblock %}
	{% block content %}
	<br>
	<form class="form-search" method="get" target="_self" action='/search' >
		<div class="input-append">
			<input type="text" class="span2 search-query" name="query">
			<button type="submit" class="btn btn-primary">Search</button>
		</div>
	</form>
	
	
	{% if result == None %}
		
	{% else %}
		<table class='table table-striped table-condensed' >
		"<b>{{ query }}</b>" 검색 결과 {{size}}건
		<div align="right">
		<!-- 
		<span class='trend trend0'>Valuable Big Data</span><br>
		<span class='trend trend1'>Progress in Cloud Services</span><br>
		<span class='trend trend2'>IT Consolidation</span><br>
		<span class='trend trend3'>Advanced Cyber Attacks</span><br>
		<span class='trend trend4'>Patents as Strategic Weapons</span><br>
		<span class='trend trend5'>Contextual Devices and Services</span><br>
		<span class='trend trend6'>Smart Vehicles</span><br>
		<span class='trend trend7'>Re-visioning of Green IT</span><br>
		<span class='trend trend8'>Rapid Business Development</span><br>
		  -->
		</div>
				{% for r in result %}
				<tr>
					<td>
					<!-- <b><a data-toggle="modal" href="#myModal">{{r.title}}</a></b> -->
					<b><p><a data-toggle="modal" href='#' onclick='init(this)' title="{{r.content}}">{{r.title}}</a></p></b>
					<p id="summary">{{r.summary|safe}}</p>
					</td>
					<td>
					{% if "valuable big data" in r.category %}
						<span class='trend trend0'>Valuable Big Data</span><br>
					{% endif %}
					{% if "Progress in Cloud Services" in r.category %}
						<span class='trend trend1'>Progress in Cloud Services</span><br>
					{% endif %}
					{% if "IT Consolidation" in r.category %}
						<span class='trend trend2'>IT Consolidation</span><br>
					{% endif %}
					{% if "Advanced Cyber Attacks" in r.category %}
						<span class='trend trend3'>Advanced Cyber Attacks</span><br>
					{% endif %}
					{% if "Patents as Strategic Weapons" in r.category %}
						<span class='trend trend4'>Patents as Strategic Weapons</span><br>
					{% endif %}
					{% if "Contextual Devices and Services" in r.category %}
						<span class='trend trend5'>Contextual Devices and Services</span><br>
					{% endif %}
					{% if "Smart Vehicles" in r.category %}
						<span class='trend trend6'>Smart Vehicles</span><br>
					{% endif %}
					{% if "Re-visioning of Green IT" in r.category %}
						<span class='trend trend7'>Re-visioning of Green IT</span><br>
					{% endif %}
					{% if "Rapid Business Development" in r.category %}
						<span class='trend trend8'>Rapid Business Development</span><br>
					{% endif %}
					</td>
				</tr>						
				{% endfor %}
				
				</table>
	{% endif %}
	<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
              <b><p id="myModalLabel" size="30">News Title</p></b>
            </div>
            <div class="modal-body">
            <pre>
              <p id="newscontent">news content</p>
              </pre>
            </div>
            <div class="modal-footer">
              <button class="btn btn-primary" data-dismiss="modal">Close</button>
              <!--  <button class="btn btn-primary">Save changes</button>-->
            </div>
          </div>
	{% endblock %}
	